﻿
var $ = window.$;
function addLevel(e, levelValue) {
    layui.use(['rate'],
        function() {
            var rate = layui.rate;
            rate.render({
                elem: '#level' + e,
                value: levelValue,
                text: true,
                setText: function(value) { //自定义文本的回调
                    const arrayList = {
                        '1': '简单',
                        '2': '较容易',
                        '3': '中等',
                        '4': '较难',
                        '5': '困难'
                    };
                    this.span.text(arrayList[value] || (value + "星"));
                    $('#level' + e).attr("level-data", value);
                 }
             });
         });
    }
//获取题目的数据
function getQuestionJson(Id, questId) {
    $.ajax({
        async: false,
        url: '/Main/GetQuestion',  // 跨域URL
        type: 'post',
        dataType: 'json',
        data: {
            id: Id,
            questId: questId
        },
        timeout: 5000,
        success: function (json) { //客户端jquery预先定义好的callback函数，成功获取跨域服务器上的json数据后，会动态执行这个callback函数
            if (json.length != undefined) {
                ShowQuestion(false,json);
                allQuestions = json;
                console.log(allQuestions);
            }
        },
    });
};


//题目显示
function ShowQuestion(drag, json) {
    if (drag) i = 0;
    $.each(json, function (i, item) {
        var itemId;
        if (item.QuestionType == 1) {
            itemId = insertSingleChoice(item.QuestionLevel);
            insertSingleChoiceData(item, itemId);
            //questionData(i, 1);
        }
        else if (item.QuestionType == 2) {
            itemId = insertTrueFalse(item.QuestionLevel);
            insertTrueFalseData(item, itemId);
            //questionData(i, 2);
        }
        else if (item.QuestionType == 3) {
            itemId = insertBlank(item.QuestionLevel);
            insertBlankData(item, itemId);
            //questionData(i, 3);
        }
        
    });
}

function insertSingleChoiceData(item,itemId) {
    var singleChoiceTb = $("#data-Index-" + itemId);
    singleChoiceTb.find(".Index").attr("data-Question-Id", item.QuestionId);
    if (item.QuestionScore != undefined) 
    $("#score" + (i - 1)).val(item.QuestionScore);
    $("#keyWordsSG" + (i - 1)).text(item.QuestKeyWords);
    singleChoiceTb.find(".QuestName").text(item.QuestionTitle);
    var choice = singleChoiceTb.find(".ChoiceValue");
    var choiceValue = item.QuestionItems.split("::");
    for (var z = 0; z < choiceValue.length; z++) {
        $(choice[z]).text(choiceValue[z]);
    };
    var answer = item.QuestionAnswer;
    var it = answer == 'A' ? 0 : answer == 'B' ? 1 : answer == 'C' ? 2 : answer == 'D' ? 3 : 4;
    $(choice[it]).parent().parent().find("button").css("background-color", "rgb(2,230,230)").attr("data-value", "1");
    singleChoiceTb.find(".QuestAnalysis").text(item.QuestionAnalysis);
}
function insertTrueFalseData(item, itemId) {
    var trueFalseTb = $("#data-Index-" + itemId);
    trueFalseTb.find(".Index").attr("data-Question-Id", item.QuestionId);
    if (item.QuestionScore != undefined) 
    $("#score" + (i - 1)).val(item.QuestionScore);
    $(`#keyWordsTF${i - 1}`).text(item.QuestKeyWords);
    trueFalseTb.find(".QuestName").text(item.QuestionTitle);
    const correct = trueFalseTb.find(`[name='CorrectValue${i - 1}']`);
    if (item.QuestionAnswer == 1) {
        $(correct[0]).attr("checked", "checked");
    } else {
        $(correct[1]).attr("checked", "checked");
    }
    trueFalseTb.find(".QuestAnalysis").text(item.QuestionAnalysis);
}
function insertBlankData(item, itemId) {
    var Blank = $("#data-Index-" + itemId);
    Blank.find(".Index").attr("data-Question-Id", item.QuestionId);
    if (item.QuestionScore != undefined) 
    $("#score" + (i - 1)).val(item.QuestionScore);
    $("#keyWordsBL" + (i - 1)).text(item.QuestKeyWords);
    Blank.find(".QuestName").text(item.QuestionTitle);
    Blank.find(".CorrectValue").text(item.QuestionAnswer);
    Blank.find(".QuestAnalysis").text(item.QuestionAnalysis);
}

$("#data-question-single").click(function () {
    insertSingleChoice(3);
});
$("#data-question-blank").click(function () {
    insertBlank(3);
});
$("#data-question-trueFalse").click(function () {
    insertTrueFalse(3);
});

var i = 0;
var j = 0;
function fn() {
    return j--;
}
function insertSingleChoice(questionLevel) {
    var item = `<div class="one light singleChoice" data-id="1" id="data-Index-` + i + `">
        <div><b class="Index" data-question-Id="`+ fn() + `"></b>选择题:<input type="text" id="score` + i + `" class="score" value="5" size="2" />分<label style="padding-left:20px;">难度：</label><span id="level` + i +`" style="vertical-align: -webkit-baseline-middle;"></span>
        &emsp;<span id="keyWordsSG`+ i +`"  class="keys"> </span>
        </div>

        <div>
            <div>试题题干：<br /><p class="QuestName p-textarea question_title form-control" contenteditable="true"></p></div>
            <div>
                <div class="div-single form-group">
                    <div class="div-float">
                        <button class="btn btn-single" type="button" data-value="0">A</button>
                    </div>
                    <div class="div-float" style="width:85%;">
                        <p class="ChoiceValue p-text form-control" contenteditable="true"></p>
                    </div>
                    <a href="#" class="close close-single" data-dismiss="alert">
                        <svg t="1637486080426" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2474" width="200" height="200">
                            <path d="M96 128h832v64H96zM128 256h768l-89.024 704H217.024z" p-id="2475"></path><path d="M384 64h256v96h-256z" p-id="2476"></path>
                        </svg>
                    </a>
                </div>
                <div class="div-single form-group">
                    <div class="div-float">
                        <button class="btn btn-single" type="button" data-value="0">B</button>
                    </div>
                    <div class="div-float" style="width:85%;">
                        <p class="ChoiceValue p-text form-control" contenteditable="true"></p>
                    </div>
                    <a href="#" class="close close-single" data-dismiss="alert">
                        <svg t="1637486080426" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2474" width="200" height="200">
                            <path d="M96 128h832v64H96zM128 256h768l-89.024 704H217.024z" p-id="2475"></path><path d="M384 64h256v96h-256z" p-id="2476"></path>
                        </svg>
                    </a>
                </div>
                <div class="div-single form-group">
                    <div class="div-float">
                        <button class="btn btn-single" type="button" data-value="0">C</button>
                    </div>
                    <div class="div-float" style="width:85%;">
                        <p class="ChoiceValue p-text form-control" contenteditable="true"></p>
                    </div>
                    <a href="#" class="close close-single" data-dismiss="alert">
                        <svg t="1637486080426" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2474" width="200" height="200">
                            <path d="M96 128h832v64H96zM128 256h768l-89.024 704H217.024z" p-id="2475"></path><path d="M384 64h256v96h-256z" p-id="2476"></path>
                        </svg>
                    </a>
                </div>
                <div class="div-single form-group">
                    <div class="div-float">
                        <button class="btn btn-single" type="button" data-value="0">D</button>
                    </div>
                    <div class="div-float" style="width:85%;">
                        <p class="ChoiceValue p-text form-control" contenteditable="true"></p>
                    </div>
                    <a href="#" class="close close-single" data-dismiss="alert">
                        <svg t="1637486080426" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2474" width="200" height="200">
                            <path d="M96 128h832v64H96zM128 256h768l-89.024 704H217.024z" p-id="2475"></path><path d="M384 64h256v96h-256z" p-id="2476"></path>
                        </svg>
                    </a>
                </div>
                <div class="div-single choose-opacity form-group">
                    <div class="div-float"><button class="btn" type="button" data-value="0">E</button></div>
                    <div class="div-float" style="width:85%;"><p class="p-text form-control" contenteditable="true"></p></div>
                    <a href="#" class="close close-single" data-dismiss="alert">
                        <svg t="1637486080426" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2474" width="200" height="200">
                            <path d="M96 128h832v64H96zM128 256h768l-89.024 704H217.024z" p-id="2475"></path><path d="M384 64h256v96h-256z" p-id="2476"></path>
                        </svg>
                    </a>
                </div>
            </div>
            <div>试题解析：<br /><p class="QuestAnalysis p-textarea form-control" contenteditable="true"></p></div>
        </div>
        <div class="tools" data-hide="0"><button class="submitForm layui-btn layui-btn-normal" data-Index="`+ i +`" type="button">确定</button><button id="remove-div" class="layui-btn layui-btn-danger" data-Index="`+ i +`" type="button">取消</button></div>
    </div>`;
    $("#div1").append(item);
    addLevel(i, questionLevel);
    return i++;
}
function insertBlank(questionLevel) {
    var item = `<div class="one light blank" data-id="3" id="data-Index-` + i + `">
        <div><b class="Index" data-question-Id="`+fn()+`"></b>填空题:<input type="text" id="score`+ i + `" class="score" value="5" size="2" />分<label style="padding-left:20px;">难度：</label><span id="level` + i +`"></span>
        &emsp;<span id="keyWordsBL`+ i +`"  class="keys"></span>
        </div>
        <div>
            <div><p class="QuestName p-textarea form-control" contenteditable="true" placeholder="请输入题目，可粘贴。"></p></div>
            <div>参考答案：<br /><p class="CorrectValue p-textarea form-control" contenteditable="true"></p></div>
            <div>试题解析：<br /><p class="QuestAnalysis p-textarea form-control" contenteditable="true"></p></div>
        </div>
        <div class="tools" data-hide="0"><button class="submitForm layui-btn layui-btn-normal" data-Index="`+ i +`" type="button">确定</button><button id="remove-div" class="layui-btn layui-btn-danger" data-Index="`+ i +`" type="button">取消</button>
        </div>
    </div>`;
    $("#div1").append(item);
    addLevel(i, questionLevel);
    return i++;
}
function insertTrueFalse(questionLevel) {
    var item = `<div class="one light judge" data-id="2" id="data-Index-` + i + `">
        <div><b class="Index" data-question-Id="`+fn()+`"></b>判断题:<input type="text" id="score`+ i + `" class="score" value="5" size="2" />分<label style="padding-left:20px;">难度：</label><span id="level` + i +`"></span>
        &emsp;<span id="keyWordsTF`+ i +`" class="keys"></span>
        </div>
        <div>
            <div><p class="QuestName p-textarea form-control" contenteditable="true"></p></div>
            <div><div><input type="radio" name="CorrectValue${i}" value="1" />对</div><div><input type="radio" name="CorrectValue${i}" value="0" />错</div></div>
            <div>试题解析：<br /><p class="QuestAnalysis p-textarea form-control" contenteditable="true"></p></div>
        </div>
        <div class="tools" data-hide="0"><button class="submitForm layui-btn layui-btn-normal" data-Index="`+ i +`" type="button">确定</button><button id="remove-div" class="layui-btn layui-btn-danger" data-Index="`+ i +`" type="button">取消</button>
    </div>`;
    $("#div1").append(item);
    addLevel(i, questionLevel);
    return i++;
}


